<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>乐购电子商城-首页</title>
    <!-- 引入公共样式  -->
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/common.css">
    <!-- 引入当前文件样式  -->
    <link rel="stylesheet" href="css/mode.css">
    <link rel="stylesheet" href="fonts/font-awesome-4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="css/login.css">
    <!-- 阿里巴巴图标库 -->
    <link rel="stylesheet" href="lib/font_2756703_d5c5clwy0es/iconfont.css">
    <script src="lib/font_2756703_d5c5clwy0es/iconfont.js"></script>
    <style>
        .icon {
          width: 1em;
          height: 1em;
          vertical-align: -0.15em;
          fill: currentColor;
          overflow: hidden;
        }
        </style>
        

</head>
<body>
    <!-- 网页头部 -->
    <header>
        <div class="topBack">
            <div class="headTop clearfix container">
                <span class="cl">乐购www.legou.com</span>
                <div class="fr">
                    欢迎光临乐购&emsp;请
                    <span>登录</span>
                    <span>注册</span>
                </div>
            </div>
        </div>
    </header>

    <section class="banner">
        <img src="./images/razerpink1.jpg" alt="">

        <div class="loginBox">

            <div class="loginTil clearfix">
                <li class="fl">普通登录</li>
                <li class="fr">扫码登录</li>
                <!-- <img src="./images/login1.png" alt="" class="loginimg"> -->
            </div>

            <div class="loginMethd">
                <div class="csc userlogin on">
                    <div class="loginMid">
                        <div class="inp">
                            <input type="text" placeholder="用户名/邮箱/手机号">
                            <div><i class="fa fa-user-o" aria-hidden="true"></i></div>
                        </div>
                        <div class="inp">
                            <input type="password" placeholder="密码">
                            <div><i class="fa fa-unlock-alt" aria-hidden="true"></i></div>
                        </div>
                        <div class="btn">
                            <button>登录</button>
                            <p class="pulink">
                                <a href="#">忘记密码</a>
                                <a href="#">注册账号</a>
                            </p>
                        </div>
                    </div>
        
                    <div class="flink">
                        <p>
                      第三方登录:
                      <span class="iconfont icon-qq"></span>
                      <span class="iconfont icon-weixin"></span>
                      <span class="iconfont icon-weibo1"></span>
                      <span class="iconfont icon-zhifubao"></span>
                      <svg class="icon" aria-hidden="true"><use xlink:href="#icon-qq"></use></svg>
                      <svg class="icon" aria-hidden="true"><use xlink:href="#icon-weixin"></use></svg>
                      <svg class="icon" aria-hidden="true"><use xlink:href="#icon-weibo1"></use></svg>
                      <svg class="icon" aria-hidden="true"><use xlink:href="#icon-zhifubao"></use></svg>
                    </p>
                    </div>
                </div>
    
                <div class="csc shaoma">
                    <div class="smlogin">
                        <div class="stitle clearfix">
                            <svg class="icon sm fl" aria-hidden="true"><use xlink:href="#icon-saoma"></use></svg>
                            <div class="p fl">打开XXXXX <br>扫一扫登录 </div>
                            <!-- <img src="./images/login2.png" alt="" class="smimg"> -->
                        </div>
                        <i class="fa fa-qrcode erweima" aria-hidden="true"></i>
                        <p><a href="#">点击下载APP</a></p>
                    </div>
                </div>
            </div>
            
        </div>
    </section>

    <!-- 网页底部 -->
    <footer class="container">
        <div class="footerTop clearfix">
            <ul>
                <li class="intarduct">
                    <img src="images/footer1.jpg" alt="" class="footerImg fl">
                    <div class="footerTopLitter fl">
                        <h2>正品保证</h2>
                        <p>正品行货&emsp;放心选购</p>
                    </div>
                </li>
                <li class="intarduct">
                    <img src="images/footer1.jpg" alt="" class="footerImg fl">
                    <div class="footerTopLitter fl">
                        <h2>正品保证</h2>
                        <p>正品行货&emsp;放心选购</p>
                    </div>
                </li>
                <li class="intarduct">
                    <img src="images/footer1.jpg" alt="" class="footerImg fl">
                    <div class="footerTopLitter fl">
                        <h2>正品保证</h2>
                        <p>正品行货&emsp;放心选购</p>
                    </div>
                </li>
                <li class="intarduct">
                    <img src="images/footer1.jpg" alt="" class="footerImg fl">
                    <div class="footerTopLitter fl">
                        <h2>正品保证</h2>
                        <p>正品行货&emsp;放心选购</p>
                    </div>
                </li>
            </ul>
        </div>
        <div class="footerMid clearfix">
            <ul class="fl footerLink">
                <h3>新手入门</h3>
                <li><a href="#" class="footerListLink">购物流程</a></li>
                <li><a href="#" class="footerListLink">会员制度</a></li>
                <li><a href="#" class="footerListLink">订单查询</a></li>
                <li><a href="#" class="footerListLink">服务协议及隐私说明</a></li>
                <li><a href="#" class="footerListLink">网站地图</a></li>
            </ul>
            <ul class="fl footerLink">
                <h3>支付方式</h3>
                <li><a href="#" class="footerListLink">货到付款</a></li>
                <li><a href="#" class="footerListLink">网上支付</a></li>
                <li><a href="#" class="footerListLink">礼品卡支付</a></li>
                <li><a href="#" class="footerListLink">其他支付</a></li>
            </ul>
            <ul class="fl footerLink">
                <h3>配送服务</h3>
                <li><a href="#" class="footerListLink">配送进度查询</a></li>
                <li><a href="#" class="footerListLink">商品验货与签收</a></li>
            </ul>
            <ul class="fl footerLink">
                <h3>相关规则</h3>
                <li><a href="#" class="footerListLink">平台规则</a></li>
                <li><a href="#" class="footerListLink">退换货政策</a></li>
                <li><a href="#" class="footerListLink">发票制度</a></li>
                <li><a href="#" class="footerListLink">帮助中心</a></li>
            </ul>
            <ul class="fl footerLink clearfix">
                <li class="fl erma">
                    <h3>App更优惠</h3>
                    <img src="./images/qryhd.png" alt="">
                </li>
                <li class="fl erma">
                    <h3>加微信查订单</h3>
                    <img src="./images/qryhd.png" alt="">
                </li>
            </ul>
        </div>
        <div class="footerButton">
            <p>沪ICP备XXXXXXXXX号 | 经营证照 | 互联网药品信息服务资格证(沪)-经营性-2017-0006 | 违法和不良信息举报电话：XXX-XXXXXXXX | 沪B2-XXXXXXX | <br>
                沪公网安备 XXXXXXXXX号 | 友情链接 | 出版物经营许可证 | 增值电信业务经营许可证</p>
            <div class="footerImg clearfix">
                <img src="./images/footerImg1.jpg" alt="" class="fl footerBtImg">
                <img src="./images/footerImg2.jpg" alt="" class="fl footerBtImg">
                <img src="./images/footerImg3.png" alt="" class="fl footerBtImg">
                <img src="./images/footerImg4.jpg" alt="" class="fl footerBtImg">
                <img src="./images/footerImg5.jpg" alt="" class="fl footerBtImg">
            </div>
        </div>
    </footer>

    <!-- 引入当前文件的js -->
    <script src="lib/jquery.js"></script>
    <script src="js/login.js"></script>
</body>
</html>